<template>
    <div class="app-loading" :hidden="!show">
        <div class="inner">
            <van-loading type="spinner" size="32px"></van-loading>
        </div>
    </div>
</template>

<script>
  export default {
    name: 'appLoading',
    props: ['show']
  }
</script>

<style scoped lang="less">
    .app-loading{
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 999;
        background: rgba(255, 255, 255, 0.8);
        &.hide{
            display: none;
        }
    }
    .inner{
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        white-space: nowrap;
        color: #333;
        font-size: 14px;
        text-align: center;
    }
</style>
